<template>
    <div class="blog__header">
        <h2 class="style2-h2 style2-h2--defult style2-h2--max20">Latest News, Blogs & Articles</h2>
        <nuxt-link to="/blogs" class="trk-btn trk-btn--rounded trk-btn--secondary4">More Blog
            <span><span><i class="fa-solid fa-arrow-right"></i></span></span></nuxt-link>
    </div>
    <div class="blog__wrapper">
        <div class="row g-4">
            <div v-for="(item, index) in posts.slice(0, 3)" :key="index" class="col-lg-4 col-md-6">
                <BlogCard :details="item" />
            </div>
        </div>
    </div>
</template>

<script>
import BlogCard from "@/components/partials/BlogCard.vue";
export default {
    components: { BlogCard },
    props: {
        posts: {
            type: Array,
            default: () => [],
        },
    },

}
</script>

<style></style>